/**
 * @class Contacts.views.ContactListPanel
 * @extends Ext.Panel
 * The panel containing our contact list.
 */
IVLE.views.LoginPanel = Ext.extend(Ext.form.FormPanel, {
    initComponent: function() {
		this.layout = 'fit';
		
		this.url = 'auth.php';
	
        this.items = [{
            xtype: 'fieldset',
			style: 'margin-left:auto;margin-right:auto',
            instructions: 'Please login.',
			
            items: [{
					xtype: 'textfield',
					name:'loginUserID', 
					label:'UserID', 
					placeholder:''
				},
				{ 
					xtype: 'passwordfield',
					name:'loginPassword',  
					label:'Password', 
					placeholder:'' 
				},
				{ 
					xtype: 'selectfield',
					name:'loginDomain',
					options: [{
						text: 'NUSSTU', value: 'nusstu'
					}, {
						text: 'NUSSTF', value: 'nusstf'
					}, {
						text: 'NUSEXT', value: 'nusext'
					}, {
						text: 'GUEST', value: 'guest'
					}],
					label:'Domain'
				},{
					xtype: 'button',
					text: 'Login',
					ui: 'confirm',
					handler: function(){
						IVLE.views.LoginPanel.superclass.submit({ 
							method:'POST', 
							waitTitle:'Connecting', 
							waitMsg:'Sending data...',
	 
				// Functions that fire (success or failure) when the server responds. 
				// The one that executes is determined by the 
				// response that comes from login.asp as seen below. The server would 
				// actually respond with valid JSON, 
				// something like: response.write "{ success: true}" or 
				// response.write "{ success: false, errors: { reason: 'Login failed. Try again.' }}" 
				// depending on the logic contained within your server script.
				// If a success occurs, the user is notified with an alert messagebox, 
				// and when they click "OK", they are redirected to whatever page
				// you define as redirect. 
 
							success:function(){ 
								Ext.Msg.alert('Status', 'Login Successful!', function(btn, text){
									if (btn == 'ok'){
										var redirect = 'test.asp'; 
										window.location = redirect;
									}
								});
							},
		 
					// Failure function, see comment above re: success and failure. 
					// You can see here, if login fails, it throws a messagebox
					// at the user telling him / her as much.  
		 
							failure:function(form, action){ 
								if(action.failureType == 'server'){ 
									obj = Ext.util.JSON.decode(action.response.responseText); 
									Ext.Msg.alert('Login Failed!', obj.errors.reason); 
								}else{ 
									Ext.Msg.alert('Warning!', 'Authentication server is unreachable : ' + action.response.responseText); 
								} 
								IVLE.views.LoginPanel.superclass.reset(); 
							} 
						}); 

								
					}
				}]
        }];
		
        this.dockedItems = [{
				xtype: 'toolbar',
				dock: 'top',
				title: 'NUS IVLE'
		}];
        
        IVLE.views.LoginPanel.superclass.initComponent.apply(this, arguments);
    },

	
});

Ext.reg('user-loginpanel', IVLE.views.LoginPanel);